<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>公司差旅系统</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="/css/bootstrap.css">
	<link rel="stylesheet" href="/css/myStyle.css">
</head>
<body style="background-image: url(/img/loginPic.jpg);background-size: cover;">
	<div class="container-fluid login">
		<div class="col-md-4 col-md-offset-4 loginstyle">
			<div class="row">
				<div class="col-md-12">
					<h2 style="color: #ffffff;">登录</h2>
				</div>
			</div>
			<div class="row" style="margin-top: 20px;">
				<div class="col-md-12">
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></div>
							<input type="text" class="form-control" id="username" placeholder="员工ID">
						</div>
					</div>
				</div>
			</div>
			<div class="row" style="margin-top: 10px;">
				<div class="col-md-12">
					<div class="form-group">
						<div class="input-group">
							<div class="input-group-addon"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></div>
							<input type="text" class="form-control" id="userpassword" placeholder="密码">
						</div>
					</div>
				</div>
			</div>

			<div class="row" style="margin-top: 10px;">
				<div class="col-md-4  col-md-offset-2 text-right">
					<img src="/code" >
				</div>
				<div class="col-md-4 text-left">
					<input placeholder="验证码" id="code" type="text" class="form-control">
				</div>
			</div>
			<div class="row" style="margin-top: 10px;">
				<div class="col-md-4 col-md-offset-4">
					<button type="button" id="submit" class="btn btn-default" style="width: 100%;">登录</button><!--单击使用ajax传输登录数据-->
				</div>
			</div>
			<div class="row">
				<div class="col-md-12">
					<h5  style="color: #ffffff;">还没有账号? <a href="/Regist.html"  style="color: #ffffff;">注册</a></h5><!--单击跳转到注册界面-->
				</div>
			</div>
		</div>
	</div>
	<script src="/js/jquery-1.12.4.min.js"></script>
	<script src="/js/bootstrap.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
		    $("#submit").click(function(){
                var name = $("#username").val();
                var password = $("#userpassword").val();

                if(name == null || name == "")
                {
                    alert("请输入用户名!");
                    return;
                }
                if(password == null || password == "")
                {
                    alert("请输入密码!");
                    return;
                }
		        $.ajax({
		            url:"/login",
					type:"post",
                    dataType:'json',
					data:{
					    name:name,
						password:password
					},
					success:function (data) {
                       alert(data)
                    }
				});



			});
		});
	</script>
</body>
</html>